<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 情况一:普通的函数被默认调用,this指向window
    function foo(name, age) {
      console.log(arguments)
      console.log(this)
    }
    foo("abc", 123)

    function sayHello(name) {
      console.log(this)
    }
    sayHello()

    // 情况二:被某个对象引用并调用它,this则指向这个对象
    var obj = {
      name: 'why',
      running: function () {
        console.log(this)// {name: 'why', running: ƒ}
        console.log(obj)// {name: 'why', running: ƒ}
        console.log(this === obj)
      }
    }
    obj.running()

    var fn = obj.running
    fn() // this->window,obj->{name: 'why', running: ƒ},false

    function bar() { console.log(this) }
    var obj = {
      name: "why",
      "bar": bar
    }
    obj.bar() // {name: 'why', bar: ƒ}
    

  </script>
</body>

</html>